← Назад на сайт

Бутэйбл шаблон

3-колоночная тема и макет для Bootstrap 3.

качественный сервис

Bootstrap 3 уже здесь.

Профессиональная команда и индивидуальный подход к каждому проекту. Качественная реализация задач любой сложности.

Читайте наше руководство по переходу на Bootstrap 3.


Активные участники

Иван Чапаев
Максим Осколков
Денис Скеллов
Катерина Ковалёва
Артём Дебергин

Модальные окна
Примеры использования модальных окон Bootstrap.
87
Карусель
Как использовать слайдер Bootstrap.
322
Типографика
Посмотрите различные текстовые элементы и опции.
44
@Media
Используйте @media-запросы для нужного макета.
119
опытная команда

Год адаптивного дизайна.

2013 год был годом адаптивного веб-дизайна. В сети полно крупных брендов, галерей и удивительных примеров того, как медиа-запросы демонстрируют возможности адаптивного дизайна.

15 авг / Иван Пирогов

Веб-дизайн прошёл долгий путь с 1999 года.


15 авг / Вильям Травников

Плоский стиль стал главным трендом года.


Качественные решения для бизнеса.. These are related concepts that predated RWD: browsers of basic mobile phones do not understand JavaScript or media queries, so the recommended practice is to create a basic web site then enhance it for smart phones and PCs—rather than try "graceful degradation" to make a complex, image-heavy site work on the most basic mobile phones.

Медиа-запросы — модуль CSS3, позволяющий адаптировать отображение контента под различные условия — например, разрешение экрана. Стал рекомендованным стандартом W3C в июне 2012 года и является ключевой технологией адаптивного веб-дизайна.

Центрированный текст

Это было задачей в версии 2.x — теперь стало чуть проще в 3.


CSS3

Чтобы понять подход RWD, нужно сначала разобраться в CSS — основе адаптивного дизайна. CSS позволяет использовать гибкие сетки на основе процентов и медиа-запросы CSS3. Сайт адаптируется под различные устройства — компьютер, ноутбук, планшет, смартфон — и условия отображения.


Об адаптивном вебе есть ещё что сказать.


Адаптивный текст

Вы когда-нибудь видели, как большие блоки текста выходят за границы или обрезаются? Один из способов решить это — переносить текст внутри контейнера. Но более «адаптивный» способ — масштабировать размер шрифта в зависимости от области просмотра . Создатели FitText сделали это в виде плагина.

Ну..

Кто-нибудь знает, почему @mdo или @fat назвали этот элемент «well» (колодец)?

Адаптивные изображения

Сетка масштабирования — не единственный аспект адаптивного дизайна. Корректное масштабирование изображений и медиа-объектов — ещё одна важная задача для разработчиков.


индивидуальная работа
качественные решения


Редактировать на Bootply